import {Box, UserLayout} from '../components'
import Router from 'next/router'
import {compose} from "../util";
import {withState} from "recompose";
import {ReactNode} from 'react'
import {Menu} from 'antd';
import {shareRouters,sysRouters,clientRouters,recruitRouters,ptRecruitRouters} from '../static/default-data'

const MenuTop = ({children, sidebarIndex, type,selectedKeys}) => {
    const getType = (type) => {
        switch (type) {
            case 'share':
                return shareRouters
            case 'sys':
                return sysRouters
            case 'client':
                return clientRouters
            case 'recruit':
                return recruitRouters
            case 'ptRecruit':
                return ptRecruitRouters
        }
    }
    return (
        <UserLayout padding='0' sidebarIndex={sidebarIndex}>
            <Box width='100%'>
                <Menu
                    defaultSelectedKeys={[selectedKeys || '0']}
                    onClick={x => {
                        Router.push(x.item.props.router);
                        return x
                    }}
                    mode="horizontal"
                    style={{background: '#fff', display: 'flex', justifyContent: 'center', lineHeight: '55px'}}
                >
                    {getType(type).map((sidebar, index) => (
                        <Menu.Item key={index} router={sidebar.router}>
                            <span>{sidebar.name}</span>
                        </Menu.Item>
                    ))}
                </Menu>
            </Box>
            <Box padding='1.5rem 2rem 2rem 2rem'>
                {children}
            </Box>
        </UserLayout>
    )
};

export default MenuTop